import React from 'react';
import ProForm, { ModalForm, ProFormTextArea } from '@ant-design/pro-form';

const OptForm: React.FC<any> = (props) => {
  const { 
    handleModalVisible, 
    handleAdd
  } = props;

  return <ModalForm
      className="modal-form"
      width="30%"
      title="添加回复"
      visible
      onVisibleChange={handleModalVisible}
      onFinish={async (value) => {
        console.log(value)
        const success = await handleAdd(value)
        if (success) {
          handleModalVisible(false)
        }
      }}
      submitter={{
        searchConfig: {
          resetText: '取消',
          submitText: '回复'
        }
      }}>
      <ProForm.Group>
        <ProFormTextArea
          label="回复"
          placeholder="限100字内"
          width="md"
          fieldProps={{
            maxLength: 100
          }}
          name="content"
        />
      </ProForm.Group>
    </ModalForm>
}
export default OptForm;
